<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<div class="carousel w-full rounded-box my-4 h-[400px] overflow-hidden">

    <c:if test="${param.carouselItems != null}">
        <c:forEach var="slide" items="${param.carouselItems}">
            <div id="${slide.id}" class="carousel-item relative w-full">
                <img src="${slide.image}" class="w-full object-cover" alt="${slide.alt}" />
                <div class="absolute inset-0 bg-gradient-to-t from-black/60 to-transparent">
                    <div class="absolute bottom-0 left-0 p-8">
                        <h2 class="text-3xl font-bold text-white mb-2">${slide.title}</h2>
                        <p class="text-white/80">${slide.description}</p>
                    </div>
                </div>
                <div class="absolute flex justify-between transform -translate-y-1/2 left-5 right-5 top-1/2">
                    <a href="#${slide.prevId}" class="btn btn-circle">❮</a>
                    <a href="#${slide.nextId}" class="btn btn-circle">❯</a>
                </div>
            </div>
        </c:forEach>
    </c:if>
</div>
